<template>
  <view class="listWrapper" :style="{
                padding:'0px ' + properties.setStyle.pageMargin+'px',
                'margin': properties.setStyle.pageMarginTop+'px '+' 0px',
              }">
    <view  class="order-card" :style="{
                 'border-radius': properties.setStyle.borderRadius + 'px ',
                'background-color': properties.setStyle.backgroundColor,
                padding: properties.setStyle.padding+'px',
                width:'100%'
              }">

      <view style="padding: 12px 15px;display: flex;align-items: center;justify-content: space-around">
        <view style="display: flex;align-items: center">
          <uv-image  :src="properties.setStyle.heade" width="60" height="60"/>
          <view :style="{
          color:properties.setStyle.textColor,
          'margin-left':'15px'
        }">
            <view>{{properties.setStyle.followName}}</view>
            <view style="font-size:13px">{{properties.setStyle.subText}}</view>
          </view>
        </view>


          <uv-button style="" @click="largerImg(properties.setStyle.heade)" plain="" size="normal" type="success" text="关注"></uv-button>
      </view>
    </view>
  </view>
</template>
<script>
import Dict from '@/components/school/dict';
import SplitLine from '@/components/school/splitLine';
import * as LoginUtil from '@/libs/login.js';
import * as OrderApi from '@/api/school/order.js';
import RichText from '@/components/school/richtext';
import {mapGetters} from "vuex";
import diyJson from '@/config/diy.js';

const app = getApp();
// 分割线
export default {
  computed: mapGetters(['uid', 'schoolId']),
  components: {
    Dict,
    SplitLine,
    RichText
  },
  data() {
    return {
      themConfig: diyJson.commonStyle,
      localDatas: this.datas
    }
  },
  name: "Follow",
  props: {

    properties: {
      type: Object,
      default: function () {
        return {
        }
      }
    },

  },
  watch: {},
  methods: {

    largerImg(url){
      uni.previewImage({
        current: url, // 当前显示图片的http链接
        urls: [url] // 需要预览的图片http链接列表
      });
    }
  },
  created() {
    console.log("saasdasds")
  }
}
</script>

<style scoped lang="scss">

.head-title {
  .new-text-view {
    display: flex;
    align-items: center;
  }

  display: flex;
  justify-content: space-between;
  padding: 5px 10rpx;
  margin-bottom: 5px;

  .H3 {
    font-size: 19px;
    //color: rgb(94, 94, 94);
  }

  .view-more {
    display: flex;
    font-size: 14px;
    color: #909399;
  }
}

.order-content {
  //background: rgb(234, 239, 252);
  border-radius: 10px;


  .content-text {
    font-size: 16px;
    color: #2c2c2c;
  }

  .content-text-view {
    margin: 15rpx 0;
  }

  .tip-text {
    color: rgb(75, 76, 77);
    font-size: 12px;
  }

  .content-tip-view {
    display: flex;
    justify-content: space-between;
    margin: 5rpx 0;
  }
}

.head {
  width: 100%;
  justify-content: space-between;
  display: flex;
  align-items: center;

  .left {
    display: flex;
    align-items: center;

    image {
      width: 70rpx;
      height: 70rpx;
      border-radius: 50%;
    }

    .name {
      line-height: 40rpx;
      margin-left: 10px;

      .uName {
        font-weight: bolder;
      }

      .time {
        color: #909399;
        font-size: 12px;
      }
    }
  }
}

.body_time {
  padding: 0px 0 10px 10px;
  color: #606266;
  font-size: 12px;
  display: flex;
}

.body {
  padding: 0px 10px;
  color: #606266;

  .sentive {
    margin-top: 10px;
    padding: 7px;
    text-align: center;
    display: inline-block;
    white-space: nowrap;
    color: white;
    border-radius: 5px;
    background: #c4c6c9;
    font-weight: initial;
  }
}

.address {
  display: flex;
  flex-direction: column;
  //justify-content: center;
  //align-items: center;

  .centerIcon {
    padding: 0 10px;
  }

  ::v-deep .uv-text__value:first-child {
    color: #606266;
    font-size: 16px !important;
  }
}

.money {
  font-size: 16px;

  .amountValue {
    font-size: 18px !important;
  }
}

.order-card {
  //margin-top: 10px;
}

.operate {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
  width: 100%;
}

.orderNo-wrapper {
  display: flex;
  justify-content: space-between;

  .orderno {
    font-size: 13px;
    color: #606266;
  }
}

.content {
  padding: 10px;
  border-radius: 5px;
  background-color: #f8f8f8;
}

.accept {
  display: flex;
  width: 100%;
  position: relative;

  .butt {
    position: relative;
    padding: 0 10px;
    width: 100%;
  }
}

.concat {
  display: flex;
  justify-content: right;
  padding: 10px 20px 0px 20px;
}

.actionAddress {
  padding: 5px 0;
}

.jwy-topRisk {
  color: red;
}

.jwy-lowRisk {
  color: #ff7800;
}
</style>

</style>
